import React, { useRef, useState,useEffect } from 'react';
import services from '@/services/home';
import { MicroApp } from '@umijs/max';
import Guide from '@/components/Guide';
import { trim,browserRedirect } from '@/utils/format';
import { PageContainer } from '@ant-design/pro-components';
import { useModel,Link } from '@umijs/max';
import { loadMicroApp } from 'qiankun';
const { getProjectList} =
  services.UserController;

import { Collapse, Space } from 'antd';
const { Panel } = Collapse;
import styles from './index.less';

const HomePage: React.FC = () => {
  const { name } = useModel('global');
  const { initialState, setInitialState }:any = useModel('@@initialState');
  const [appName, setAppName] = useState('');
  useEffect(() => { 
    console.log('=====app2====',initialState);
    if(initialState.currentSystem && initialState.currentSystem.id){
      setAppName('app'+initialState.currentSystem.id);
    
      const microApp = loadMicroApp({
        name: 'app'+initialState.currentSystem.id, // 唯一 id
        entry: 'http://test.thinkcar.cn/app2/', // html entry
        container: '#sub-app-container',
      });
      microApp?.update?.({});
      console.log('=====microApp==');
      return () => {
        microApp.unmount();
      };
    }
  }, [initialState])
  return (
    <PageContainer ghost>
      <div className={styles.container}>
          {/* <MicroApp name={appName} autoSetLoading  /> */}
          <div id="sub-app-container"></div>
      </div>
    </PageContainer>
  );
};

export default HomePage;
